<!-- 一般纳税人 -->
<template>
  <div class="pimrecord4">
    <div class="Submitted" v-if="show">
      <p class="tips">* 您已经提交过该证明材料 如需更改 请联系客服人员...</p>
      <ul>
        <li>
          <span>开户行：</span>
          <i>{{bank_account}}</i>
        </li>
        <li>
          <span>银行账号：</span>
          <i>{{bank_num}}</i>
        </li>
        <li>
          <span>税 号：</span>
          <i>{{tax_num}}</i>
        </li>
        <li>
          <span>公司地址：</span>
          <i>{{address}}</i>
        </li>
      </ul>
    </div>
    <div v-else class="form-box">
      <van-form @submit="onSubmit">
        <van-field
          v-model="openingBank"
          name="开户行"
          label="开户行"
          placeholder="请输入开户银行"
          :rules="[{ required: true, message: '请填写开户行' }]"
        />
        <van-field
          v-model="bankAccount"
          type="text"
          name="银行账号"
          label="银行账号"
          placeholder="请输入银行账号"
          :rules="[{ required: true, message: '请填写银行账号' }]"
        />
        <van-field
          v-model="dutyParagraph"
          type="text"
          name="税号"
          label="税号"
          placeholder="请输入税号"
          :rules="[{ required: true, message: '请填写税号' }]"
        />
        <van-field
          v-model="address"
          type="text"
          name="公司地址"
          label="公司地址"
          placeholder="请输入公司地址"
          :rules="[{ required: true, message: '请填写公司地址' }]"
        />
        <div style="margin: 16px;">
          <van-button round block type="info" native-type="submit" :disabled="disabled">提交</van-button>
        </div>
      </van-form>
    </div>
  </div>
</template>
<script>
import luhnCheck from "./luhnCheck";
export default {
  name: "PimRecord4",
  data() {
    return {
      bank_account: null,
      bank_num: null,
      tax_num: null,
      prove: false,
      show: false, // tips的显示与隐藏
      // 纳税人证明
      disabled: false, // 按钮点击的提交事件
      dialogImageUrl: "", // 纳税人证明暂存路径
      dialogVisible: false, // 纳税人证明

      openingBank: "", // 开户行
      bankAccount: "", //银行账号
      dutyParagraph: "", //税号
      address: "" // 公司地址
    };
  },
  methods: {
    //是否提交过个人信息
    getInvoice() {
      const user_id = window.localStorage.getItem('user_id');
      // console.log(user_id);
      this.$http({
        method: "post",
        url: "index/web/doSelfInfos",
        data: {
          user_id,
          status: "company"
        }
      })
        .then(res => {
          console.log(res);
          if (res.data.State.Code == "200") {
            let prove = res.data.data.prove
            typeof prove !== "number" && console.log("类型不是number");
            if (prove === 1) {
              // res.data.prove 0：未提交  1：已提交   number
              this.show = true;
              this.bank_account = res.data.data.bank_account;
              this.bank_num = res.data.data.bank_num;
              this.tax_num = res.data.data.tax_num;
              this.address = res.data.data.address;
            } else {
              this.show = false;
            }
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //提交纳税人证明
    onSubmit() {
      console.log(
        this.openingBank,
        this.bankAccount,
        this.dutyParagraph,
        "提交纳税人证明"
      );
      const user_id = window.localStorage.getItem('user_id');
      let bank_account = this.openingBank;
      let bank_num = this.bankAccount;
      let tax_num = this.dutyParagraph;
      let address = this.address;
      this.$http({
        method: "post",
        url: "index/web/invoice",
        // headers: { "X-Requested-With": "XMLHttpRequest" }, // 必须加这个请求头 否则报错：500
        data: {
          user_id,
          prove: "1",
          bank_num,
          bank_account,
          tax_num,
          address
        }
      })
        .then(res => {
          if (res.data.State.Code == 200) {
           
            this.$Notify({ type: "success", message: "提交成功..." });
          }
        })
        .catch(err => {
          console.log(err, "?????");
        });
    }
  },
  created() {
    this.getInvoice();
  }
};
</script>


<style lang="scss" scoped>
// 一般纳税人
.pimrecord4 {
  .Submitted {
    width: 90%;
    margin: auto;
    ul {
      li {
        line-height: 40px;
        display: flex;
        flex-direction: row;
        span {
          color: #333;
          width: 90px;
          text-align: right;
        }
        i {
          flex: 1;
          color: #999;
        }
      }
    }
  }
  .tips {
    text-align: center;
    color: #f40;
    line-height: 30px;
    margin-bottom: 10px;
    font-size: 12px;
  }
}

</style>
